<script lang="tsx">
/**
 * 供应商管理
 */
export default {
  name: "supplier"
}
</script>

<script lang="tsx" setup>
import {ref} from "vue"
import {definePageModel, PageModel} from "@/frame/view/layout/page-model/constructor.ts"
import {getCode} from "@/utils/get-code.ts"
import {CodeRuleTypeEnum} from "@/utils/enum.ts"
import APIS from "@/apis"

/**
 * 页面模型
 */
const pageModelRef = ref()
const config = definePageModel<any>({
  url: APIS.SUPPLIER_BASE,
  searchForm: {
    els: [
      {
        eType: "el-input",
        prop: "code",
        props: {
          placeholder: "供应商编码",
          clearable: true
        }
      },
      {
        eType: "el-input",
        prop: "name",
        props: {
          placeholder: "供应商名称",
          clearable: true
        }
      },
      {
        eType: "el-select",
        prop: "isEnable",
        props: {
          placeholder: "是否启用",
          clearable: true
        },
        optionsData: {
          list: [
            {
              label: "启用",
              value: true
            },
            {
              label: "禁用",
              value: false
            }
          ],
          label: "label",
          value: "value"
        }
      }
    ]
  },
  programForm: {
    els: [
      {
        label: "新增",
        eType: "el-button",
        props: {
          type: "primary"
        },
        event: "add"
      }
    ]
  },
  table: {
    page: {
      enable: true,
      pageSize: 20
    },
    props: {
      stripe: true,
      border: true
    },
    operation: {
      width: 100,
      els: [
        {
          eType: "el-button",
          label: "编辑",
          event: "edit",
          props: {
            type: "primary",
            link: true
          },
          hide: false
        },
        {
          eType: "el-button",
          label: "删除",
          event: "delete",
          props: {
            type: "primary",
            link: true
          },
          hide: false
        }
      ]
    },
    els: [
      {
        label: "供应商编码",
        prop: "code",
        minWidth: 120
      },
      {
        label: "供应商名称",
        prop: "name",
        minWidth: 120
      },
      {
        label: "供应商联系人",
        prop: "contact",
        minWidth: 120
      },
      {
        label: "供应商电话",
        prop: "phone",
        minWidth: 120
      },
      {
        label: "供应商地址",
        prop: "phone",
        minWidth: 120
      },
      {
        label: "是否启用",
        prop: "isEnable",
        minWidth: 120,
        renderFn(data: any) {
          return <span>{data.isEnable ? "已启用" : "未启用"}</span>
        }
      },
      {
        label: "创建时间",
        prop: "createTime",
        minWidth: 160
      }
    ]
  },
  form: {
    title: "新增/编辑",
    width: 500,
    sheetForm: {
      initValue: {
        isEnable: true
      },
      async bindData(data: any) {
        if (!data?.id) {
          data.code = await getCode(CodeRuleTypeEnum.供应商管理表)
        }
        return data
      },
      labelWidth: "100px",
      els: [
        {
          label: "供应商编码",
          eType: "el-input",
          prop: "code",
          renderFn(data) {
            return <span>{data.code}</span>
          }
        },
        {
          label: "供应商名称",
          eType: "el-input",
          prop: "name",
          props: {
            placeholder: "供应商名称",
            clearable: true
          }
        },
        {
          label: "联系人",
          eType: "el-input",
          prop: "contact",
          props: {
            placeholder: "联系人",
            clearable: true
          }
        },
        {
          label: "联系电话",
          eType: "el-input",
          prop: "phone",
          props: {
            placeholder: "联系电话",
            clearable: true
          }
        },
        {
          label: "是否启用",
          eType: "el-switch",
          prop: "isEnable"
        }
      ]
    }
  }
})

/**
 * 新增
 */
const handleAdd = () => {
  pageModelRef.value.handleAdd()
}

/**
 * 编辑
 */
const handleEdit = (row: any) => {
  pageModelRef.value.handleEdit(row)
}

/**
 * 删除
 */
const handleDelete = (row: any) => {
  pageModelRef.value.handleDelete(row)
}
</script>

<template>
  <PageModel ref="pageModelRef" :PageModel="config" @add="handleAdd" @delete="handleDelete" @edit="handleEdit"/>
</template>

<style lang="scss" scoped>
</style>